<template>
	<el-container class="lz-layout h-100">
		<el-header class="p-0">
            <Header></Header>
        </el-header>
		<el-container class="content">
			<el-aside width="240px">
                <SideNav></SideNav>
            </el-aside>
			<el-main class="pr-0 pb-0">
                <router-view></router-view>
            </el-main>
		</el-container>
        <!-- <el-footer class="border-top">Footer</el-footer> -->
	</el-container>
</template>

<script>

import Header from './../components/Header';
import SideNav from './../components/SideNav';

export default {
    name: 'Home',
    components: {
        Header,
        SideNav
    }
}

</script>

<style lang="scss" scoped>
    .el-header{
        border-bottom: 1px solid #eee;
    }
    .el-aside{
        overflow: hidden;
        border-right: 1px solid #eee;
    }
    .el-main{
        width: calc(100% - 240px);
    }
    .content{
        overflow: hidden;
    }
</style>
